<template>
  <div class="process-leave">
    <el-row class="myRow ">
      <el-col class="title">加班申请</el-col>
    </el-row>
    <el-row class="myRow">
      <el-col :span="2">补偿方式：</el-col>
      <el-col :span="3">{{ procData.compensation }}</el-col>
      <el-col :span="2">加班开始时间：</el-col>
      <el-col :span="4">{{ procData.start_time }}</el-col>
    </el-row>
    <el-row class="myRow footer">
      <el-col :span="2">加班结束时间：</el-col>
      <el-col :span="3">{{ procData.end_time }}</el-col>
      <el-col :span="2">申请原因：</el-col>
      <el-col :span="4">{{ procData.reason }}</el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  props: {
    procData: {
      type: Object,
      default: function() {
        return {}
      }
    }
  }

}
</script>

  <style scoped>
      .myRow{
        margin-top: 20px;
        font-size: 14px;
    }
    .myRow .title{
        font-size: 18px;
    }
    .footer{
        margin-bottom: 20px;
    }
  </style>
